<!-- 新增成本管理 -->
<template>
  <div class="page p20">
    <div class="form">
      <el-form ref="form" :model="pageAjax.data" inline>
        <div class="list">
          <div>
            <el-form-item label="日期:">
              <el-date-picker
                v-model="pageAjax.data.datetime"
                type="daterange"
                value-format="yyyy-MM-dd"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                disabled
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item label="平台:">
              <el-select
                v-model="pageAjax.data.platform"
                disabled
                placeholder="请选择平台"
              >
                <el-option
                  v-for="item in biPlatformList"
                  :key="item.value"
                  :label="item.name"
                  :value="item.value"
                >
                </el-option>
              </el-select>
              <!-- <el-input
                v-model="item.platform"
                placeholder="输入平台"
                style="width:200px;"
              ></el-input> -->
            </el-form-item>
            <el-form-item label="币别:">
              <el-input
                v-model="pageAjax.data.coinType"
                disabled
                placeholder="输入币别"
                style="width:100px;"
              ></el-input>
            </el-form-item>
            <el-form-item label="币别兑换比例:">
              <el-input
                v-model="pageAjax.data.coinRate"
                disabled
                style="width:100px;"
              ></el-input>
            </el-form-item>
            <el-form-item label="状态:">
              {{ pageAjax.data.checkStatus == 1 ? "已核销" : "未核销" }}
            </el-form-item>

            <el-form-item label="充值方式:">
              <el-input
                v-model="pageAjax.data.rechargeType"
                disabled
              ></el-input>
            </el-form-item>
            <el-form-item label="审核单号:">
              <el-input v-model="pageAjax.data.checkNo" disabled></el-input>
            </el-form-item>
            <el-form-item label="平台账号:">
              <el-input
                v-model="pageAjax.data.platformAccount"
                disabled
              ></el-input>
            </el-form-item>
            <el-form-item label="摘要:">
              <el-input v-model="pageAjax.data.remark" disabled></el-input>
            </el-form-item>
            <el-form-item label="期初余额:">
              <el-input
                v-model="pageAjax.data.originalMoney"
                disabled
              ></el-input>
            </el-form-item>
          </div>
          <div class="mt20">
            <div>
              <el-form-item label="本期增加额:"> </el-form-item>
            </div>
            <el-form-item label="充值金额:">
              <el-input
                v-model="pageAjax.data.rechargeMoney"
                disabled
              ></el-input>
            </el-form-item>
            <el-form-item label="充值系数:">
              <el-input
                v-model="pageAjax.data.rechargeRate"
                disabled
              ></el-input>
            </el-form-item>
            <el-form-item label="实际到账额:">
              <el-input
                v-model="pageAjax.data.actualArrival"
                disabled
              ></el-input>
            </el-form-item>
          </div>
          <div class="mt20">
            <div>
              <el-form-item label="本期减少额:">
                <el-input
                  v-model="pageAjax.data.platformAccount"
                  disabled
                ></el-input>
              </el-form-item>
            </div>
            <el-form-item label="日常扶持刷币:">
              <el-input
                v-model="pageAjax.data.dailyBrushCoin"
                disabled
              ></el-input>
            </el-form-item>
            <el-form-item label="针对性扶持刷币:">
              <el-input
                v-model="pageAjax.data.pointBrushCoin"
                disabled
              ></el-input>
            </el-form-item>
            <el-form-item label="招募主播刷币:">
              <el-input
                v-model="pageAjax.data.anchorBrushCoin"
                disabled
              ></el-input>
            </el-form-item>
            <el-form-item label="其他情况刷币:">
              <el-input
                v-model="pageAjax.data.otherBrushCoin"
                disabled
              ></el-input>
            </el-form-item>
            <el-form-item label="刷币总额:">
              <el-input
                v-model="pageAjax.data.totalBrushCoin"
                disabled
              ></el-input>
            </el-form-item>
            <el-form-item label="本期余额:">
              <el-input
                v-model="pageAjax.data.balanceMoney"
                disabled
              ></el-input>
            </el-form-item>
          </div>
          <div class="mt20">
            <el-form-item label="公会分成比例:">
              <el-input v-model="pageAjax.data.publicRate" disabled></el-input>
            </el-form-item>
            <el-form-item label="刷币公会分成:">
              <el-input v-model="pageAjax.data.brushPublic" disabled></el-input>
            </el-form-item>

            <el-form-item label="预计主播返还金额:">
              <el-input
                v-model="pageAjax.data.expectBackMoney"
                disabled
              ></el-input>
            </el-form-item>
            <el-form-item label="针对性扶持主播号:">
              <el-input
                v-model="pageAjax.data.pointAnchorNo"
                disabled
              ></el-input>
            </el-form-item>
            <el-form-item label="针对性扶持主播昵称:">
              <el-input
                v-model="pageAjax.data.pointAnchorNick"
                disabled
              ></el-input>
            </el-form-item>
          </div>
        </div>
      </el-form>
    </div>
  </div>
</template>

<script>
// 校验规则
// 当充值方式为“线下”时，日期、平台、币别、币别兑换比例、充值金额、充值系数、实际到账额、
//（日常扶持刷币、针对性扶持刷币、招募主播刷币、其它情况刷币，不能都为空）、刷币总额、公会分成比例、刷币公会分成为必填项，点击“提交时校验”，提示“数据X的XX不能为空”

// 当充值方式为“线上”时，日期、平台、币别、币别兑换比例、平台账号、期初余额、充值余额、充值系数、实际到账金额、
//（日常扶持刷币、针对性扶持刷币、招募主播刷币、其它情况刷币，不能都为空），刷币总额、本期余额、公会分成比例、刷币公会分成都为必填项，点击“提交时校验”，提示“数据X的XX不能为空”

//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';
// import { deepClone } from "@/utils";
// import excelMap from "../map.js";
import { getRewardDetail } from "@/api/finance";
// import { getOssParam } from "@/api/others";

export default {
  name: "",
  //import引入的组件需要注入到对象中才能使用
  props: {
    biPlatformList: {
      type: Array
    },
    id: {
      type: Number
    }
  },
  data() {
    //这里存放数据
    return {
      pageAjax: {
        data: {}
      }
    };
  },
  //方法集合
  methods: {
    getPageData() {
      let _that = this;
      let id = _that.id;
      getRewardDetail({ checkId: id })
        .then(resp => {
          let respData = resp.data || {};
          let respResult = respData.data || {};
          if (respData.code === _that.STATUS.success[0]) {
            respResult.datetime = [respResult.beginTime, respResult.endTime];
            _that.pageAjax.data = respResult;
          } else {
            _that.$message.error(respData.msg || "获取失败");
          }
        })
        .finally(() => {});
    },
    cancel() {
      this.pageAjax.data = {};
      this.$emit("cancel");
    }
  }
};
</script>
<style lang="scss" scoped>
//@import url(); 引入公共css类
.page {
  position: absolute;
  top: 15px;
  right: 15px;
  bottom: 15px;
  left: 15px;
  padding-top: 60px;
  .top {
    height: 50px;
    width: 100%;
    box-sizing: border-box;
    padding: 15px;
    position: absolute;
    top: 0;
    left: 0;
  }

  .form {
    height: calc(100% - 60px);
    width: 100%;
    position: absolute;
    top: 60px;
    left: 0;
    overflow: auto;
    padding: 15px;
    box-sizing: border-box;
  }
}
.file-box {
  width: 500px;
}
.tit {
  font-weight: bold;
  color: #333;
  padding-bottom: 10px;
}
.image {
  width: 100%;
  height: 100%;
}
.img {
  width: 260px;
  height: 500px;
  background: #ddd;
  margin-right: 15px;
  margin-bottom: 15px;
  position: relative;
  display: inline-block;
  .icon {
    font-size: 30px;
    position: absolute;
    top: 5px;
    right: 5px;
    z-index: 1;
    cursor: pointer;
  }
}
.img-box {
  margin: 20px 0;
}
.footer {
  text-align: center;
}
.list {
  padding-top: 15px;
  border-top: 1px solid #ddd;
}
</style>
<style lang="scss">
.img-box {
  .el-icon-circle-close {
    color: #fff;
  }
}
</style>
